@extends('admin.layouts.app')
@section('css')
  <link href="{{asset('assets/plugins/responsive-table/css/rwd-table.min.css')}}" rel="stylesheet" type="text/css" media="screen">
@endsection
@section('content')


						<!-- Page-Title -->
						<div class="row">
							<div class="col-sm-12">
                               

								<h4 class="page-title">管理后台</h4>
								<ol class="breadcrumb">
									<li>
										<a href="{{url('zadmin')}}">塔台</a>
									</li>
									
									<li class="active">
										轮播图管理
									</li>
								</ol>
							</div>
						</div>
						
						
						
						<div class="row">
							<div class="col-sm-12">
								<div class="card-box">

									<div class="row">
			                        	<div class="col-sm-8">
			                        		<form role="form">
			                                    <div class="form-group contact-search m-b-30">
			                                    	<input type="text" id="search" class="form-control" placeholder="Search...">
			                                        <button type="submit" class="btn btn-white"><i class="fa fa-search"></i></button>
			                                    </div> <!-- form-group -->
			                                </form>
			                        	</div>
			                        	<div class="col-sm-4">
<button  class="btn btn-default btn-md waves-effect waves-light m-b-30 addModal" data-animation="fadein"                          	data-overlaySpeed="200" data-overlayColor="#36404a"><i class="md md-add"></i> 添加</button>
			                        	</div>
			                        </div>
@include('admin.common.error')

									<div class="table-rep-plugin">
										<div class="table-responsive" >
											<table  class="table  table-striped">
												<thead>
													<tr>
														<th>ID</th>
														
														<th data-priority="1">名称</th>
														<th data-priority="1">图片</th>
														<th data-priority="1">内容</th>
														
														
														<th data-priority="3">操作</th>
														
													</tr>
												</thead>
												<tbody>
                        @foreach($list as $v)  
						<tr>
							<th>{{$v->id}}</th>														
							<td>{{$v->name}}</td>
							<td>{{$v->pic}}</td>
							<td>{{$v->contents}}</td>							
														
					<td>
						<a href="{{url('zadmin/banner/'.$v->id.'/edit')}}" class="btn btn-primary btn-sm">
						<span class="btn-label">
										<i class="md md-edit"></i>
										</span>编辑</a>

				<a class="btn btn-sm btn-danger" href="{{url('zadmin/banner',$v->id)}}" data-method="delete" 
  data-token="{{csrf_token()}}" data-confirm="确定删除吗?">
<span class="btn-label">
  <i class="md md-close"></i>
</span>删除</a>
													   </td>
														
													</tr>
                        @endforeach
													
												</tbody>
											</table>
										</div>
{{$list->links()}}
									</div>

								</div>
							</div>
						</div>
						


				<div id="add-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                                        <div class="modal-dialog">
                                            <div class="modal-content">
                                                <div class="modal-header">
                                                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                                                    <h4 class="modal-title" id="myModalLabel">添加</h4>
                                                </div>
                                             <form class="form-horizontal" role="form" method="post" action="{{url('zadmin/banner')}}">  
                                             {{csrf_field()}}  
                                                <div class="modal-body">
                                                                                       
	                                            <div class="form-group">
	                                                <label class="col-md-2 control-label">名称</label>
	                                                <div class="col-md-10">
	               <input type="text" class="form-control" value="" name="name" required="">
	                                                </div>
	                                            </div>
	    <div class="form-group">
	        <label class="col-md-2 control-label">滚动图</label>
	        <div class="col-md-10">
	            <button type="button" class="btn btn-primary upload" data-id="pic" id="pic" >上传滚动图</button>
	        </div>
	        <div class="pic_pic"></div>
	    </div>
	    <div id="container"></div>

	    <div class="form-group">
	        <label class="col-md-2 control-label">内容图</label>
	        <div class="col-md-10">
	             <button type="button" class="btn btn-primary upload" data-id="contents" id="contents" >上传内容图</button>
	        </div>
	        <div class="pic_contents"></div>
	    </div>                                             
                                                </div>
                                                <div class="modal-footer">
                                                    <button type="button" class="btn btn-default waves-effect" data-dismiss="modal">关闭</button>
                                                    <button type="submit" class="btn btn-primary waves-effect waves-light">提交</button>
                                                </div>
            <input type="hidden" name="pic" />
            <input type="hidden" name="contents" />
            </form>
                                            </div><!-- /.modal-content -->
                                        </div><!-- /.modal-dialog -->
                                    </div><!-- /.modal -->

 @endsection 
               
         

    @section('js')
     <script type="text/javascript" src="/js/plupload/plupload.full.min.js"></script>
    <script type="text/javascript">
    	$('.addModal').on('click',function(){
    		$('#add-modal').modal('show');
    	});


    	$('.upload').on('click',function(){
        var _this = $(this);
        var _id = _this.data('id');
        initUploader(_id);    
  });

 
  function initUploader(id) {
    console.info(id);
    var uploader1 = new plupload.Uploader({
      runtimes : 'html5,flash,silverlight,html4',
      browse_button : id, // you can pass an id...
      container: document.getElementById('container'), // ... or DOM Element itself
      url : '/upload.php',
      flash_swf_url : '../js/Moxie.swf',
      silverlight_xap_url : '../js/Moxie.xap',
              
      filters : {
                max_file_size : '10mb',
                mime_types: [
                  {title : "Image files", extensions : "jpg,gif,png"}
                  
                ]
      },

              
    });

    uploader1.bind('Init', function(up, params) {
        $('#filelist_'+id).html("");
    });

    $('#'+id).click(function(e) {
        
        e.preventDefault();
    });

    uploader1.init();

    uploader1.bind('FilesAdded', function(up, files) {
        up.refresh();
        var temp_img_name = '';
        $.each(files, function(i, file) {
            // $('#filelist_'+id).append(
            //     '<div id="' + file.id + '">' +
            //     file.name + ' (' + plupload.formatSize(file.size) + ') ' +
            // '</div>');
            if(temp_img_name == ''){
            temp_img_name += file.name;
            } else {
            temp_img_name += ', ' + file.name;
            }

        });
       
        up.start();
        up.refresh(); // Reposition Flash/Silverlight
    });

    uploader1.bind('UploadProgress', function(up, file) {
        $('#' + file.id + " b").html(file.percent + "%");
    });

    uploader1.bind('Error', function(up, err) {
        $('#filelist_'+id).append("<div>Error: " + err.code +
            ", Message: " + err.message +
            (err.file ? ", File: " + err.file.name : "") +
            "</div>"
        );

        up.refresh(); // Reposition Flash/Silverlight
    });

    uploader1.bind('FileUploaded', function(up, file,info) {
        $('#' + file.id + " b").html("100%");
        var rs =  JSON.parse(info.response);
        if(rs.status){
          var str = '<img style="padding:5px" src="'+rs.data+'" width="100">';
          $('.pic_'+id).append(str);                                
          $('input[name="'+id+'"]').val(rs.data);        
      }
          
    });

  
  
  }

    	

  
    </script> 
       
    @endsection    

